<!doctype html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="user-scalable=no" />
		<title>某互联网公司触屏网站</title>
		<link rel="stylesheet" type="text/css" href="common.css" />
		<link rel="stylesheet" href="idangerous.swiper.css">
		<link rel="stylesheet" href="idangerous.swiper.scrollbar.css">
		<style>
			* {
				margin: 0;
				padding: 0;
			}
			
			body,
			html {
				position: relative;
				height: 100%;
				width: 100%;
				background-color: #F0F0F2;
				font-family: "微软雅黑";
				/*border: 1px solid yellow;*/
			}
			
			.swiper-nav {
				width: 100%;
				font-size: 3.5em;
				background-color: #F0F0F2;
				border-top: 1px solid rgba(255, 255, 255, 0.2);
				/*border: 1px solid;*/
				margin-top: 2em;
				
			}
			
			.swiper-nav .swiper-wrapper {
				margin: 0;
			}
			
			.swiper-nav span {
				padding: 0 2px;
				display: block;
				border: 1px solid #F0F0F2;
				border-radius: 15px;
				color: black;
				text-align: center;
				text-shadow: 1px 1px 1px #154166;
				padding: 0 10px;
				cursor: pointer;
				margin: 0.5em;
			}
			
			.swiper-nav .swiper-slide:first-child span {
				border-left: none;
			}
			
			.swiper-nav .swiper-slide:last-child span {
				border-right: none;
			}
			
			.swiper-nav .active span {
				border: 1px solid #2574b8;
				background: #2574b8;
			}
			
			.swiper-pages {
				width: 99%;
				height: 100%;
				/*border: 1px solid red;*/
			}
			
			.scroll-container {
				height: 100%;
				width: 100%;
			}
			
			.scroll-container .swiper-slide {
				width: 100%;
				/*border: 1px solid;*/
			}
			
			.page-inner {
				width: 100%;
				/*border: 1px solid;*/
			}
		</style>
	</head>

	<body>
		<div class="comtop">
			<div class="comtop_left fuhao" onclick="window.history.back()"><i class="Hui-iconfont">&#xe6d4;</i></div>
			<div class="comtop_center">
				<span>招投标信息</span>
			</div>
			<div class="comtop_right fuhao"><i class="Hui-iconfont">&#xe68f;</i></div>
		</div>
		<div id="main-box">
			<div class="swiper-nav swiper-container">
				<div class="swiper-wrapper">
					<div class="swiper-slide active"><span>招标信息</span></div>
					<div class="swiper-slide"><span>中标信息</span></div>
				</div>
			</div>
			<div class="swiper-pages swiper-container">
				<div class="swiper-wrapper">
					<div class="swiper-slide">
						<div class="swiper-container scroll-container swiper-no-swiping">
							<div class="swiper-wrapper">
								<div class="swiper-slide">
									<div class="page-inner">
										<div class="lb div-div1">
											<a href="sgzb/sgzb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">施工招标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
											<a href="sgzb/sgzb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">监理招标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
											<a href="sgzb/sgzb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">设计招标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
											<a href="sgzb/sgzb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">设备招标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
											<a href="sgzb/sgzb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">公路招标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
											<a href="sgzb/sgzb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">专业招标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="swiper-slide">
						<div class="swiper-container scroll-container">
							<div class="swiper-wrapper">
								<div class="swiper-slide">
									<div class="page-inner">
										<div class="lb div-div1">
											<a href="sgzb/sgzhongb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">施工中标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
											<a href="sgzb/sgzhongb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">监理中标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
											<a href="sgzb/sgzhongb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">设计中标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
											<a href="sgzb/sgzhongb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">设备中标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
											<a href="sgzb/sgzhongb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">公路中标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
											<a href="sgzb/sgzhongb.html">
												<div class="hd">
													<div class="hd_div"></div>
													<div class="hdc_div">专业中标</div>
													<div class="hd_div hdr_div"></div>
												</div>
											</a>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		
		<script src="jquery-1.11.0.js"></script>
		<!-- Don't forget to get the latest Swiper and scrollbar version here-->
		<script src="idangerous.swiper-2.0.min.js"></script>
		<script src="idangerous.swiper.scrollbar-2.0.js"></script>
		<script>
			$(function() {

				//Init Navigation
				var nav = $('.swiper-nav').swiper({
					slidesPerView: 'auto',
					freeMode: true,
					noSwiping: true,
					freeModeFluid: true,
					calculateHeight: true,
					visibilityFullFit: true,
					onSlideClick: function(nav) {
						pages.swipeTo(nav.clickedSlideIndex)
					}
				})

				//Function to Fix Pages Height
				function fixPagesHeight() {
					$('.swiper-pages').css({
						height: $(window).height() - nav.height - 48
					})
				}
				$(window).on('resize', function() {
					fixPagesHeight()
				})
				fixPagesHeight()

				//Init Pages
				var pages = $('.swiper-pages').swiper({
					noSwiping: true,
					onSlideChangeStart: function() {
						$(".swiper-nav .active").removeClass('active')
						$(".swiper-nav .swiper-slide").eq(pages.activeIndex).addClass('active')
					},
				})

				var mySwiper = new Swiper('#banner', {
					loop: true,
					autoplay: 5000,
					calculateHeight: true,
					pagination: '.pagination',

					//其他设置
				});

				//Scroll Containers
				$('.scroll-container').each(function() {
					$(this).swiper({

						mode: 'vertical',
						scrollContainer: true,
						mousewheelControl: true,
						scrollbar: {
							container: $(this).find('.swiper-scrollbar')[0]
						}
					})
				})

			})
		</script>
	</body>

</html>